<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>统计字符串出现的次数</title>
    <style>
        #title {
            color: rgb(33, 19, 185);
        }
        #result {
            color: rgb(33, 19, 185);
        }
    </style>
</head>
<body>
    <div>
        <p id="title">请输入一个字符串：</p>
        <input type="text" id="fatherString">
        <p id="title">请输入一个子串</p>
        <input type="text" id="sonString">
        <button id="submit">提交</button>
        <p id="result">子串出现的次数为：</p>
        
        <script>
            submit.onclick = function () {
                let fatherString = document.getElementById('fatherString')
                let sonString = document.getElementById('sonString')
                let count = 0
                let flag = 1
                let fatherText = fatherString.value
                let sonText = sonString.value
                for (let i = 0; i < fatherText.length; i++) {
                    flag = 1
                    for (let j = 0; j < sonText.length; j++) {
                        if (fatherText[i + j] !== sonText[j]) {
                            flag = 0;
                            break;
                        }
                    }
                    if (flag === 1) {
                        count++;
                    }
                }
                document.getElementById('result').innerHTML = '字串出现的次数为：' + count;
            }
        </script>
    </div>
    


</body>
</html>